// 挂号操作
<template>
  <el-row class="section-content">
    <el-col :span="24" class="section-option">
      <TopManu @handelSave="handelSave" :TopArr="TopArr"></TopManu>
    </el-col>    
    <el-col :span="24">
      <el-col :span="13" style="padding:10px 10px 0 10px;">
        <ViewTitle text="可挂号信息" />
        <el-col :span="24" style="padding:10px 0px 10px 0px;">
          <FromList :tableTitle="doctorTitle" :highlightCurrentRow="highlightCurrentRow" @handleCurrentChange="handleCurrentChange"  highlight-current-row="true"  :tableData="doctorData" />
        </el-col>
        <ViewTitle text="收费项目" />
        <el-col :span="24" style="padding:30px 0 10px 0">
          <el-col :span="8">
            病历本费(元):0
          </el-col>
          <el-col :span="8">
            挂号费(元):{{form.register_fee}}
          </el-col>
          <el-col :span="8">
            诊查费(元):{{form.treat_fee}}
          </el-col>
        </el-col>
      </el-col>
      <el-col :span="11" class="content-right">
        <ViewTitle text="患者信息" />
        <el-col :span="24" class="section-message">
          <el-col :span="5" class="message-image">
            <img :src="his_01" alt="">
            <el-col :span="24">
               <el-col :span="24" style="padding:10px 0 0 0"> <el-button type="primary" @click="getIdCard" plain>读卡</el-button></el-col>
            </el-col>
            <el-col :span="24" style="padding:10px 0 0 0"> <el-button type="primary" @click="dialogFormVisible = true" plain>建立档案</el-button></el-col>
          </el-col>
          <el-col :span="19" class="message-text">
            <!-- //头像右边表单信息 -->
          <el-form :inline="false" :model="form" label-width="80px">
            <el-col :span="24">
              <el-col :span="8">
                <el-form-item label="病人姓名:">
                  <el-input v-model="form.name" disabled ></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="性别:">
                  <el-select v-model="form.gender" disabled  placeholder="">
                    <el-option label="男" value="1"></el-option>
                    <el-option label="女" value="2"></el-option>
                    <el-option label="未知" value="3"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="年龄:">
                    <el-input v-model="form.age" disabled ></el-input>
                </el-form-item>
              </el-col>
            </el-col>
            <el-col :span="24">
              <el-col :span="12">
                <el-form-item label="出生日期:">
                  <el-date-picker
                    v-model="form.birthday"
                    type="date"
                    disabled
                    placeholder="选择日期"
                    >
                  </el-date-picker>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="身份证号:">
                    <el-input v-model="form.id_card"></el-input>
                </el-form-item>
              </el-col>
            </el-col>
            <el-col :span="24">
              <el-col :span="12">
                <el-form-item label="联系方式:">
                 <el-input v-model="form.phone" disabled></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="婚姻状况:">
                  <el-select v-model="form.status" placeholder="">
                      <el-option label="未婚" value="1"></el-option>
                      <el-option label="已婚" value="2"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-col>
            <el-col :span="24">
              <el-col :span="12">
                <el-form-item label="来源方式:">
                  <el-select v-model="form.source" placeholder="">
                      <el-option label="自走" value="1"></el-option>
                      <el-option label="家人扶来" value="2"></el-option>
                      <el-option label="民警送来" value="3"></el-option>
                      <el-option label="外接" value="4"></el-option>
                      <el-option label="其他" value="5"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="病人性质:">
                  <el-select v-model="form.nature" placeholder="">
                      <el-option label="自费" value="1"></el-option>
                      <el-option label="医保" value="2"></el-option>
                      <el-option label="农保" value="3"></el-option>
                      <el-option label="残联" value="4"></el-option>
                      <el-option label="其他" value="5"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-col>
            <el-col :span="24">
               <el-form-item label="家庭地址:">
                   <el-input v-model="form.city" disabled></el-input>
                </el-form-item>
            </el-col>
            <el-col :span="24">
               <el-col :span="7">
                <el-form-item label="担保人:">
                   <el-input v-model="form.bondsman"></el-input>
                </el-form-item>
               </el-col>
               <el-col :span="17">
               <el-form-item label="担保人联系方式:" label-width="130px">
                   <el-input v-model="form.bondsmanPhone"></el-input>
                </el-form-item>
               </el-col>
            </el-col>
          </el-form> 
          </el-col>
        </el-col>
        <ViewTitle text="挂号信息" />
        <el-col :span="24" style="paddingTop:10px;">
           <el-form :inline="false" :model="form" label-width="80px">
            <el-col :span="24">
              <el-col :span="8">
                <el-form-item label="挂号号:">
                  <el-input v-model="form.registration" disabled></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="门诊号:">
                    <el-input v-model="form.patientNumber" disabled></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="初/复诊:">
                  <el-select v-model="form.look_type" placeholder="">
                    <el-option label="初诊" value="1"></el-option>
                    <el-option label="复诊" value="2"></el-option>
                  </el-select>
                </el-form-item>
              </el-col>
            </el-col>
            <el-col :span="24">
              <el-col :span="8">
                <el-form-item label="挂号医生:">
                  <el-input v-model="form.real_name" disabled></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="医生科室:">
                    <el-input v-model="form.dept_name" disabled></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="8">
                <el-form-item label="病种:">
                    <el-input v-model="form.entity"></el-input>
                </el-form-item>
              </el-col>
            </el-col>
            <el-col :span="24">
                <el-form-item label="备注:">
                 <el-input v-model="form.remark"></el-input>
                </el-form-item>
            </el-col>
          </el-form> 
        </el-col>
        <ViewTitle text="费用信息" />
        <el-col :span="15" style="paddingTop:10px;">
           <el-form :inline="false" :model="form" label-width="80px">
            <el-col :span="24">
              <el-col :span="12">
                <el-form-item label="应收金额:">
                  <el-input v-model="form.old_amount" @input="disPrice"></el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="抹零(元):">
                    <el-input v-model="form.dis_price" @input="disPrice"></el-input>
                </el-form-item>
              </el-col>
            </el-col>
            <el-col :span="24">
              <el-col :span="12">
                <el-form-item label="收费(元):">
                  <el-input v-model="form.amount" disabled></el-input> 
                </el-form-item>
              </el-col>
              <el-col :span="12">
                <el-form-item label="收银(元):">
                    <el-input v-model="form.s_money" @input="setMoney"></el-input>
                </el-form-item>
              </el-col>
            </el-col>
             <el-col :span="24">
                <el-form-item label="找零(元):">
                  <el-input v-model="form.g_money" disabled></el-input>
                </el-form-item>
            </el-col>
            <el-col :span="24">
                <el-form-item label="摘要">
                 <el-input v-model="form.abstract"></el-input>
                </el-form-item>
            </el-col>
              <el-col :span="24">
                <el-form-item label="说明">
                 <el-input v-model="form.explain"></el-input>
                </el-form-item>
            </el-col>
          </el-form> 
        </el-col>
        <el-col :span="8" :offset="1" style="paddingTop:10px;">
           <FromList :tableTitle="costTitle" :tableData="costDate" />
        </el-col>
      </el-col>
    </el-col>
  <!-- 建立档案 -->
  <el-dialog title="建立患者档案" :visible.sync="dialogFormVisible">
    <el-form :inline="true" :model="dialogForm" label-width="auto">
      <el-form-item label="姓名" >
        <el-input v-model="dialogForm.name" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item label="身份证号">
        <el-input v-model="dialogForm.id_card" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item label="性别">
        <el-select v-model="dialogForm.gender" placeholder="">
          <el-option label="男" value="1"></el-option>
          <el-option label="女" value="2"></el-option>
          <el-option label="未知" value="3"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="联系方式">
        <el-input v-model="dialogForm.phone" autocomplete="off"></el-input>
      </el-form-item>
      <el-form-item label="出生日期">
         <el-date-picker
            v-model="dialogForm.birthday"
            type="date"
            placeholder="选择日期"
            format="yyyy 年 MM 月 dd 日"
            value-format="yyyy-MM-dd">
          </el-date-picker>
      </el-form-item>
      <el-form-item label="家庭地址">
        <el-input v-model="dialogForm.address" autocomplete="off"></el-input>
      </el-form-item>
    </el-form>
    <div slot="footer" class="dialog-footer">
      <el-button @click="dialogFormVisible = false">取 消</el-button>
      <el-button type="primary" @click="handelMemberSave">保 存</el-button>
    </div>
  </el-dialog>
  </el-row> 
</template>

<script>
let that 
import FromList from "@/forComponents/fromList/fromList"
import TopManu from "@/components/TopMenu"
import ViewTitle from "@/forComponents/viewTitle/index.vue"
import {getDoctorList,getPatientNo,getNumber,handelSave,handelMemberSave,getProfileList,getGetInfo} from "@/api/register"
import his_01 from "@/assets/his_01.png"
export default {
   name:"registration",
   data(){
     return {
      index:"",
      loading:"",
      doctorPage:0,
      doctorSize:10,
      his_01:his_01,
      dialogFormVisible:false,
      highlightCurrentRow:true,
      dialogForm:{
        name:"",
        id_card:"",
        gender:"3",
        phone:"",
        birthday:"",
        address:""
      },
      form:{
        id:"", //患者Id
        name:"", //病人姓名
        age:0, //age
        gender:"3", //sex
        birthday:"", //出生日期
        id_card:"522631199811080026", //身份证号
        phone:"", //联系方式
        source:"1", //来源方式
        nature:"1", //病人性质
        address:"", //家庭地址
        bondsman:"", //担保人
        bondsmanPhone:"", //担保人联系方式
        registration:"", //挂号号
        patientNumber:"", //门诊号
        look_type:"1",  //初/复诊
        real_name:"",  //挂号医生
        remark:"",  //备注
        entity:"",  //病种
        dept_name:"",  //科室
        status:"1", //婚姻状况
        old_amount:0,  //应收
        dis_price:0,  //抹零
        amount:0, //收费
        s_money:0, //收银
        g_money:0, //找零
        abstract:"", //摘要
        explain:"",//说明
        register_fee:"", //挂号费
        treat_fee:"", //诊疗费
        doctor_id:"",  //医生Id
      },
      
      doctorTitle:[
        {
            prop:"number",
            name:"序号",
            type:1,
            width:80
        },
        {
            prop:"dept_name",
            name:"科室",
            type:1,
        },
        {
            prop:"real_name",
            name:"医生",
            type:1,
        },
        {
            prop:"positional_title",
            name:"职称",
            type:1,
        },
        {
            prop:"register_fee",
            name:"挂号费",
            type:1,
        },
        {
            prop:"treat_fee",
            name:"诊疗费",
            type:1,
        },
        {
            prop:"look_count",
            name:"挂号次数",
            type:1,
        }
      ],
      
      
      doctorData:[
        
      ],
      costTitle:[
        {
            prop:"payWay",
            name:"付款方式",
            type:1,
            width:80
        },
        {
            prop:"money",
            name:"金额",
            type:1,
        },
      ],
      costDate:[
        {
          payWay:"现金",
          money:0
        },
        {
          payWay:"微信",
          money:0
        },
        {
          payWay:"支付宝",
          money:0
        },
        {
          payWay:"银联",
          money:0
        },
        {
          payWay:"预交金",
          money:0
        },
        
      ]
     }
   },
   watch:{
    index(to){
      if(to == 0){
        that.loading.close();
      }else{
      that.loading = this.$loading({
          lock: true,
          text: '',
          background: 'rgba(0, 0, 0, 0.7)'
        });
      }
    }
   },
   mounted(){
     that = this
     that.getDoctorList()
     that.getPatientNo()
   },
   methods:{
    getGetInfo(){
      that.index++
      getGetInfo({cert_no:that.form.id_card,cert_type:"02"})
      .then(res=>{
        console.log(res)
        that.index--
        this.$message({
          message:"获取成功",
          type: 'success'
        });
      })
      .catch(e=>{
        that.index--
        this.$message({
          message:e.message,
          type: 'error'
        });
      })
    },
    handelDropdown(e){
      if(e == 1){
        that.getGetInfo()
      }
    },
    setMoney(){
      that.$set(that.form,"g_money",that.form.s_money - that.form.amount)
    },
    disPrice(){
      that.$set(that.form,"amount",that.form.old_amount - that.form.dis_price)
    },
    getIdCard(){
      that.$set(that.form,"id_card",that.form.id_card)
      that.getProfileList()
    },
    getPatientNo(){
     that.index++
     getPatientNo()
     .then(res=>{
       that.index--
       that.$set(that.form,"patientNumber",res.data.patient_no)   
     })
     .catch(e=>{
        that.index--
        this.$message({
          message:e.message,
          type: 'error'
        });
     })
    },
    handelMemberSave(){
      that.index++
      let flag = false
      Object.keys(that.dialogForm).forEach(key=>{
        if(that.dialogForm[key] == ""){
          flag = true
          this.$message({
            message:"请正确填写信息",
            type: 'error'
          });
        }
      })
      if(flag){
        that.index--
        return false
      }
      handelMemberSave({...that.dialogForm})
      .then(res=>{
        that.index--
        let {name,id_card,birthday,phone,address,age,gender,id} = res.data
        gender = `${gender}`
        this.$message({
            message:"保存成功",
            type: 'success'
        });
        let data = {
          name,
          id_card,
          birthday,
          phone,
          address,
          age,
          gender,
          id
        }
        Object.keys(data).forEach(key=>{
          that.$set(that.form,key,data[key])
          that.$set(that.dialogForm,key,data[key])
        })
        that.dialogFormVisible = false
      })
      .catch(e=>{
        that.index--
        that.dialogFormVisible = false
        this.$message({
          message:e.message,
          type: 'error'
        });
      })
    },
    getProfileList(){
      that.index++
      getProfileList({id_card:that.form.id_card})
      .then(res=>{
        that.index--
        let {name,id_card,birthday,phone,address,age,gender,id} = res.data
        gender = `${gender}`
        let data = {
          name,
          id_card,
          birthday,
          phone,
          address,
          age,
          gender,
          id
        }
        Object.keys(data).forEach(key=>{
          that.$set(that.form,key,data[key])
          that.$set(that.dialogForm,key,data[key])
        })
      })
      .catch(e=>{
        that.index--
        that.dialogFormVisible = true
        that.$set(that.dialogForm,"id_card",that.form["id_card"])
        this.$message({
          message:"请建立患者档案",
          type: 'error'
        });
      })
    },
    getNumber(e){
      getNumber({user_id:e})
      .then(res=>{
        that.$set(that.form,"registration",res.data.number) 
      })
      .catch(e=>{
        this.$message({
          message:e.message,
          type: 'error'
        });
      })
    },
      
    handleCurrentChange(e){
          that.$set(that.form,"dept_name",e["dept_name"])   
          that.$set(that.form,"real_name",e["real_name"])
          that.$set(that.form,"register_fee",e["register_fee"])   
          that.$set(that.form,"treat_fee",e["treat_fee"])  
          that.$set(that.form,"doctor_id",e["user_id"])
          that.$set(that.form,"old_amount",parseFloat(e["register_fee"])+ parseFloat(e["treat_fee"]))
          that.$set(that.form,"amount",that.form.old_amount - that.form.dis_price)
          that.getNumber(e.user_id)
},        
    getDoctorList(){
      that.index++
      getDoctorList({page:that.doctorPage,limit:that.doctorSize})
      .then(res=>{
        that.index--
        let {data:{list}} = res
        console.log(list)
        list.forEach(item=>{
          let arr = {
            number:item.id,
            dept_name:item.doctor.dept_name,
            real_name:item.doctor.real_name,
            positional_title:item.doctor.positional_title,
            register_fee:item.register_fee ? item.register_fee.register_fee : '',
            treat_fee:item.register_fee ? item.register_fee.treat_fee : '',
            look_count:item.look_count,
            user_id:item.user_id
          }
          that.doctorData.push(arr)
        })
     })
      .catch(e=>{
        that.index--
        console.log(e)
        this.$message({
          message:e.message,
          type: 'error'
        });
      })
    },
    inputChange(){
      console.log("进入")
      that.$set(that.form,"g_money",that.form.amount - that.form.old_amount)
    },
    handelSave(e){ 
      that.index++
      let data = {
        member_id:"",
        doctor_id:"",
        remark:"",
        look_type:"",
        old_amount:"",
        dis_price:"",
        look_type:"",
        amount:"",
        s_money:"",
        g_money:"",
        number:"",
        patient_no:""
      }
      Object.keys(data).forEach(key=>{
        if(key == "member_id"){
           data[key] = that.form["id"]
        }else if(key == "number"){
           data[key] = that.form["registration"]
        }else if(key == "patient_no"){
          data[key] = that.form["patientNumber"]
        }else{
          data[key] = that.form[key]
        }
      })
      data.payment = 1
      data.member_type = 1
      data.department_id = 0
      data.register_type = 0
      data.mdtrt_id = 0
      data.mdtrt_cert_type = 0
      data.mdtrt_cert_no = 0
      handelSave({...data})
      .then(res=>{
          that.index--
         this.$message({
          message:"挂号成功",
          type: 'success'
        });
         this.$router.push({path:'/workstation/chargesOutpatient'})
          
      })
      .catch(e=>{
        that.index--
        this.$message({
          message:e.message,
          type: 'error'
        });
      })
    },
    change(val) {
      console.log(val)
    },
   },
   components:{
     FromList,
     TopManu,
     ViewTitle
   }
}
</script>

<style lang='scss' scoped>
  @import "./index.scss";
  
</style>